<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>登录</title>
    <!-- bower:css -->
    <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css" />
    <!-- endbower -->
    <style type="text/css">
      .css-form input.ng-invalid.ng-dirty {
        background-color: #FA787E;
      }
      .css-form input.ng-valid.ng-dirty {
        background-color: #78FA89;
      }
      .expander{
        border: 1px solid black;
        width: 250px;
      }
      .expander > .title{
        background-color: #000000;
        color: #ffffff;
        padding: .1em .3em;
        cursor: pointer;
      }
      .expander > .body{
        padding: .1em .3em;
      }
      .closed{
        display: none;
      }
    </style>
    <!--<script type="text/ng-template" id="helloTemplateInline">
      <div>Hello everyone!</div>
    </script>-->
</head>
<body ng-app="loginApp">
<div ng-controller="dirCtrl">
  <h1>{{true|checkLogin}}</h1>
  <hello></hello>
  <!--<expander class="expander" expander-title="title">
    {{text}}
  </expander>-->

  <accordion>
    <expander class="expander" ng-repeat="expander in expanders" expander-title="expander.title">
      {{expander.text}}
    </expander>
  </accordion>
</div>
<div class="container">
  <!-- novalidate 屏蔽浏览器自带验证功能-->
  <!-- ngModel指令会自动为元素添加以下css类：
    ng-valid
    ng-invalid
    ng-pristine
    ng-dirty
  -->
  <form class="form-horizontal css-form" name="loginForm" ng-controller="LoginCtrl" ng-submit="loginProcess()" novalidate>
    <!--<input type="hidden" name="clientType" value="BROWSER" ng-model="formData.clientType"/>
    <input type="hidden" name="clientId" id="clientId" value="" ng-model="formData.clientId"/>-->
    <div class="form-group">
      <label for="username" class="col-sm-2 control-label">用户名：</label>
      <div class="col-sm-10">
        <input type="text" class="form-control" id="username" name="username" placeholder="用户名"
               ng-model="formData.username" ng-maxlength="10" required>
        <div ng-messages="loginForm.username.$error">
          <div ng-message="required">用户名必须填写！</div>
          <div ng-message="maxlength">用户名长度不能超过10！</div>
        </div>
      </div>
    </div>
    <div class="form-group">
      <label for="password" class="col-sm-2 control-label">密码：</label>
      <div class="col-sm-10">
        <input type="password" class="form-control" id="password" name="password" ng-minlength="6" placeholder="密码"
               ng-model="formData.password" required>
        <div ng-messages="loginForm.password.$error">
          <div ng-message="required">密码必须填写！</div>
          <div ng-message="minlength">密码长度不能少于6个字符！</div>
        </div>
      </div>
    </div>
    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button type="submit" class="btn btn-default" ng-disabled="!loginForm.$valid" >登录</button>
        <button type="reset" class="btn btn-default">重置</button>
      </div>
    </div>
  </form>
</div>
<!-- bower:js -->
<script src="../bower_components/jquery/dist/jquery.js"></script>
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="../bower_components/angular-animate/angular-animate.js"></script>
<script src="../bower_components/angular-cookies/angular-cookies.js"></script>
<script src="../bower_components/angular-resource/angular-resource.js"></script>
<script src="../bower_components/angular-route/angular-route.js"></script>
<script src="../bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="../bower_components/angular-touch/angular-touch.js"></script>
<script src="../bower_components/angular-md5/angular-md5.js"></script>
<script src="../bower_components/angular-messages/angular-messages.js"></script>
<!-- endbower -->

<script src="../scripts/common/require.js"></script>
<script src="../scripts/common/appCommon.js"></script>
<script src="../scripts/filter/loginFilter.js"></script>
<script src="../scripts/directive/testDirective.js"></script>
<script src="../scripts/controllers/login.js"></script>
</body>
</html>
